import styled from "styled-components";

export const SearchWrapper = styled.div`
  padding: 15px;
  .head {
    width: 100%;
    height: 44px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .btn {
      font-size: 16px;
      background-color: #f15b6c;
      border-radius: 5px;
      color: #fffffb;
      width: 50px;
    }
  }
  .body {
    margin-top: 15px;
  }
`;

export const HistoryRecord = styled.div`
  .title {
    display: flex;
    justify-content: space-between;
    padding-bottom: 10px;
    .title-left {
      font-size: 16px;
      font-weight: 550;
      color: #130c0e;
    }
  }
  .main {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    .main-item {
      padding: 5px 10px;
      height: 25px;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 10px;
      margin-right: 10px;
      margin-top: 7px;
      box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%);
    }
  }
`;
export const SearchFind = styled.div`
  margin-top: 15px;
  .title {
    font-size: 16px;
    font-weight: 550;
    color: #130c0e;
    padding-bottom: 10px;
  }
  .main {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    .find-item {
      width: 50%;
      font-size: 15px;
      color: #130c0e;
      margin-top: 5px;
    }
  }
`;
export const Result = styled.div`
  .result-title {
    width: 100%;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 1px 0px #ddd;
    .result-title-item {
      display: block;
      margin-right: 15px;
      font-size: 16px;
      color: #130c0e;
    }
    .active {
      color: #ed1941;
      font-weight: 550;
      border-bottom: 2px solid #ed1941;
    }
  }
`;
